<!DOCTYPE html>
<html lang="zh-CN">

	<head>
		<!--定义好页面编码 -->
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<!--描述：这里定义好移动端的自适应-->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>Bootstrap 模板</title>
		<!-- 引入好Bootstrap css样式文件 -->
		<link href="css/bootstrap.css" rel="stylesheet">

		<!-- HTML5 shim 和 Respond.js 是为了让 IE8 支持 HTML5 元素和媒体查询（media queries）功能 -->
		<!-- 警告：通过 file:// 协议（就是直接将 html 页面拖拽到浏览器中）访问页面时 Respond.js 不起作用 -->
		<!--[if lt IE 9]>
      <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
    <![endif]-->
		<!--描述：引入js文件 记住一定要先引入JQuery的支持-->
		<script src="js/jquery-1.12.4.js"></script>
		<!-- 引入bootStrap的js文件-->
		<script src="js/bootstrap.js"></script>
	</head>

	<body>
<!-- 
用户信息
------------------------------------
	用户名:   []
	性别:  . 男  . 女
	状态:  . 活跃
				 . 待定
				保存 重置-->

	<div class="container" style="margin: 10px;">
		
			<form action="javascript:void(0)" method="post" class="form-horizontal">
				<fieldset>
					<legend><label>用户信息</label></legend>
					<div class="form-group">
						<label for="username" class="control-label col-md-3">用户名</label>
						<div class="col-md-6">
							<input id="username" name="username" type="text" class="form-control" placeholder="请输入用户名" />
						</div>
					</div>
					<div class="form-group">
						 <label class="control-label col-md-3">性别</label>
						 <div class="col-md-6">
						 	<div class="radio-inline">
						 		<label><input type="radio" id="sex" name="sex" >男</label>
						 	</div>
						 	<div class="radio-inline">
						 		<label><input type="radio" id="sex" name="sex" >女</label>
						 	</div>
						 </div>
					</div>
					<div class="form-group">
						<label class="col-md-3 control-label">状态</label>
						<div class="col-md-6">
							<div class="radio">
								<label><input type="radio" name="status">活跃</label>
							</div>
							<div class="radio">
								<label><input type="radio" name="status">待定</label>
							</div>
						</div>
					</div>
					<div class="form-group">
						<div class="col-md-6 col-md-offset-3">
							<button class="btn btn-primary">保存</button>
							<button class="btn btn-warning">重置</button>
						</div>
					</div>
				</fieldset>
			</form>		
			
	</div>



	</body>

</html>